<template>
  <div class="">
    <el-select v-model="pvalue" placeholder="parent data">
      <el-option
        v-for="item in parentOptions"
        :key="item.value"
        :label="item.label"
        :value="item.value">
      </el-option>
    </el-select>
    <!-- 省略v-bind/on v-bind:childOptions v-on:getChildren -->
    <!-- 前者自定义名称便于子组件调用，后者要传递数据名 -->
    <Children :childOptions="parentOptions" @getChildren="getChildren" />
  </div>
</template>
 
<script>
import Children from './children.vue'
export default {
  name: '',
  components: { Children },
  data () {
    return {
      parentOptions: [
        {value: '选项1', label: 'label1'},
        {value: '选项2', label: 'label2'},
        {value: '选项3', label: 'label3'}
      ],
      pvalue: '选项2'
    }
  },
  methods: {
    getChildren(v) {
      this.pvalue = v
    }
  }
}
</script>
 
<style scoped lang="scss">
 
</style>